<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>    
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
var idflag=false;
var ssnflag=false;
var flag=true;
	function checkReg(){	
		var f=document.regForm;
		if(f.id.value==""){
			alert("아이디를 입력하세요!");
			f.id.focus();
			return false;
		}else if(f.ssn.value==""){
			alert("주민번호를 입력하세요!");
			f.ssn.focus();
			return false;
		}else if(f.password.value==""){
			alert("비밀번호를 입력하세요!");
			f.password.focus();
			return false;
		}else if(f.password.value!=f.confirm.value){
			alert("비밀번호가 일치하지 않습니다.");
			f.confirm.focus();
			return false;
		}else if(f.name.value==""){
			alert("이름을 입력하세요!");
			f.name.focus();
			return false;
		} else if(f.member_addr.value==""){
			alert("주소를 입력하세요!");
			f.member_addr.focus();
			return false;
		} else if(f.email.value==""){
			alert("이메일을 입력하세요!!");
			f.email.focus();
			return false;
		}else if(f.member_tel.value==""){
			alert("전화번호를 입력하세요!");
			f.member_tel.focus();
			return false;
		}else if(f.idFlag.value==""){
			alert("아이디 중복 확인하세요!");
			return false;
		}else if(f.password.value.length<4){
			alert("비밀번호는 5자 이상이어야 합니다.");
			return false;
		}else if(idflag==true){
			alert("id");
			alert("존재하는 아이디 입니다.");
			return false;
		}else if(ssnflag==true){
			alert("ssn");
			alert("이용할 수 없는 번호입니다.");
			return false;			
		}else if(f.ssn.value.length<13){
			alert("주민등록번호는 13자리 입력하셔야 합니다.");
			return false;
		}
		f.submit();
	}
		var xhr; // ajax 송수신을 담당하는 객체 
		function createXMLHttpRequest() {
			if (window.ActiveXObject) {// ms 일 경우 
				xhr = new ActiveXObject("Microsoft.XMLHTTP");
			} else { // ms 가 아닐 경우 
				xhr = new XMLHttpRequest();
			}
		}
		var cId;		
		function idCheck(){
			cId=document.regForm.id.value;
			 if(cId.length<=3){
				document.getElementById("idInfo").innerHTML=
					"아이디를 4자 이상 입력하세요";
			}else{
				createXMLHttpRequest();
				xhr.onreadystatechange=callback;
				xhr.open("post","mycinema.do",true);
				xhr.setRequestHeader('Content-Type',
				'application/x-www-form-urlencoded;charset=utf-8');
				xhr.send("command=idcheck&id="+cId);
			}
		}		
		function callback(){
			if(xhr.readyState==4){
				if(xhr.status==200){
					var jsonData=eval("("+xhr.responseText+")");
					if(jsonData.idflag){								
						document.getElementById("idInfo").innerHTML= "'"+	cId+"' 사용할 수 없는 아이디 입니다.";												
						document.regForm.idFlag.value="fali";						
						idflag=true;						
					}else if(jsonData.ssnflag){
						document.getElementById("ssnInfo").innerHTML="'"+	sNo+"' 등록할 수 없는 번호 입니다.";
						document.regForm.ssnFlag.value="fali";
						ssnflag=true;
					}else{
						document.getElementById("idInfo").innerHTML="'"+	cId+"' 사용할 수 있는 아이디 입니다";
						document.getElementById("ssnInfo").innerHTML="'"+	sNo+"' 사용할 수 있는 번호 입니다";
						document.regForm.idFlag.value="ok";
						document.regForm.ssnFlag.value="ok";
						idflag=false;
						ssnflag=false;
					}
				}
			}
	}
	var sNo;
	function sCheck(){
		sNo=document.regForm.ssn.value;
		if(sNo.length<=12){
			document.getElementById("ssnInfo").innerHTML=	
			"주민등록 번호  13자리를 입력하세요.";	
			}else{
				createXMLHttpRequest();
				xhr.onreadystatechange=callback;
				xhr.open("post","mycinema.do",true);
				xhr.setRequestHeader('Content-Type',
				'application/x-www-form-urlencoded;charset=utf-8');
				xhr.send("command=ssnCheck&ssn="+sNo);
			}
		}
	function paCheck(){
		var pa=document.regForm.password.value;
		if(pa.length<4){
			document.getElementById("passInfo").innerHTML="비밀번호를 4자 이상 입력하세요";
		}else{
			document.getElementById("passInfo").innerHTML="";
		}
	}
	/* function confirm2(){
		alert('ㅋ');
			var con=document.regForm;
			var flag=true;
			if(flag){
				alert("약관에 동의해 주세요.");
				return false;
			}
	} */
</script>
</head>

<body>
<font size="4" color="black">회원정보입력</font><hr>
<font size="2" color="gray">회원정보는 개인정보취급방침에 따라 안전하게 보호되며 회원님의 명백한 동의 없이 공개또는 제 3자에게 제공되지 않습니다.</font><a href="mycinema.do?command=contract"><font size="2" color="blue">개인정보 취급방침</font></a><br><br><br>
<form action="mycinema.do" method="post" name="regForm">
<input type="hidden" name="command" value="register">
<input type="hidden" name="idFlag" value="">
<input type="hidden" name="ssnFlag" value="">
<p class="notice" align="center"><img src="https://static.nid.naver.com/images/user/images/join2/ico_essential.gif" alt="*" width="7" height="7"> 표시 필수입력사항</p>
<table align="center" border="0" cellspacing='0' cellpadding='5'> 
<tr><td bgcolor="#ededed" colspan="2" ><img src="https://static.nid.naver.com/images/user/images/join2/ico_essential.gif" alt="*" width="7" height="7" >아 이 디</td><td ><input type="text" name="id" onkeyup="idCheck()" style="height:20px; width:200px" ></td>
<td width="300" ><span id="idInfo"></span></td></tr> 
<tr><td bgcolor="#ededed" colspan="2"><img src="https://static.nid.naver.com/images/user/images/join2/ico_essential.gif" alt="*" width="7" height="7">주민번호</td><td><input type="text" name="ssn" maxlength=13   onkeyup="sCheck()" style="height:20px; width:200px"></td>
<td width="300"><span id="ssnInfo"></span></td></tr>
<tr><td bgcolor="#ededed" colspan="2"><img src="https://static.nid.naver.com/images/user/images/join2/ico_essential.gif" alt="*" width="7" height="7">비밀번호</td> <td><input type="password" name="password" onkeyup="paCheck()" style="height:20px; width:200px"></td>
<td><span id="passInfo"></span></td></tr>
<tr><td bgcolor="#ededed" colspan="2"><img src="https://static.nid.naver.com/images/user/images/join2/ico_essential.gif" alt="*" width="7" height="7">비밀번호 확인</td><td><input type="password" name="confirm" style="height:20px; width:200px"></td><td></td></tr>
<tr><td bgcolor="#ededed" colspan="2"><img src="https://static.nid.naver.com/images/user/images/join2/ico_essential.gif" alt="*" width="7" height="7">이    름</td><td><input type="text"  name="name" style="height:20px; width:200px"></td><td></td></tr>
<tr><td bgcolor="#ededed" colspan="2"><img src="https://static.nid.naver.com/images/user/images/join2/ico_essential.gif" alt="*" width="7" height="7">주    소</td><td><input type="text" name="member_addr" style="height:20px; width:200px"></td><td></td></tr>
<tr><td bgcolor="#ededed" colspan="2"><img src="https://static.nid.naver.com/images/user/images/join2/ico_essential.gif" alt="*" width="7" height="7"> 본인확인용 연락처</td>
			<td colspan="2" >
				<p class="txt7"><font size="2" color="red">메일주소와 전화번로를 입력하시면<br>영화 정보를 보내드립니다. </font>
											
									</p>
				<div class="help_wrap pwqa02">
					<strong class="title01">1. 메일 주소</strong>
					<div class="pw_mail">
						<input name="email"  type="text" value="" onFocus="inFocus2(this)" onBlur="outFocus2(this)" class="input_text w88" title="이메일ID입력" style="height:20px; width:200px">
						<!-- @
						<input name="email"  type="text" value="" onFocus="inFocus2(this)" onBlur="outFocus2(this)" class="input_text w130" title="이메일서비스입력">

						<select name="pw_email_list" style="width:107px; height:22px" onchange="check_pw_mail_unreal(this.form);">
						<option selected="selected">선택하세요</option>
						<option value="naver.com">naver.com</option>
						<option value="nate.com">nate.com</option>
						<option value="dreamwiz.com">dreamwiz.com</option>
						<option value="yahoo.co.kr">yahoo.co.kr</option>
						<option value="empal.com">empal.com</option>
						<option value="unitel.co.kr">unitel.co.kr</option>
						<option value="gmail.com">gmail.com</option>
						<option value="korea.com">korea.com</option>
						<option value="chol.com">chol.com</option>
						<option value="paran.com">paran.com</option>
						<option value="freechal.com">freechal.com</option>
						<option value="hanmail.net">hanmail.net</option>
						<option value="hotmail.com">hotmail.com</option>
						<option value="self">직접 입력</option>
						</select> -->
					</div>
				</div>
<div class="help_wrap pwqa03">
					<strong class="title01">2. 휴대폰 번호</strong>
					<div class="pw_mail">
					<!-- 	<select name="mobile1" id="mobile1" style="width:77px;height:22px">
							<option value="">선택</option>
							<option value="010" selected>010</option>
							<option value="011" >011</option>
							<option value="016" >016</option>
							<option value="017" >017</option>
							<option value="018" >018</option>
							<option value="019" >019</option>
						</select>
						-
						<input name="member_tel" type="text" maxlength=4 value="4939" onFocus="inFocus2(this);" onBlur="outFocus2(this);" class="input_text w88" title="전화번호국번">
						- -->
						<input name="member_tel" id="mobile3" type="text" maxlength=11 value="" onFocus="inFocus2(this);" onBlur="outFocus2(this);" class="input_text w88" title="전화번호뒤네자리" style="height:20px; width:200px">
					</div>
				</div>
				</td>
				</tr>
<tr><td colspan="3" align="right"><img src="img.board/btn_confirm.gif" onclick="checkReg()"></td></tr>   
</table>

</form>
</body>
</html>